/**
 * InfiniteClassification 无限极分类
 * author 陈学龙 2017-09-10 14:00:00
 */
.infinite-classification {
    margin:0;
    background-color:#373d41;
}

.infinite-classification .list {
    
}

/** 顶级模块 **/
.infinite-classification .list .item {

}

.infinite-classification .list .item .function {
    position:relative;
    cursor:pointer;
    transition:all 0.12s linear;
    -webkit-transition:all 0.12s linear;
    -moz-transition:all 0.12s linear;
    -ms-transition:all 0.12s linear;
    -o-transition:all 0.12s linear;
}

.infinite-classification .list .item .top-cur {
    background-color: #566167;
}

.infinite-classification .list .item .function > * {
    height:40px;
    line-height:40px;
}

.infinite-classification .list .item .function .icon {
    position:absolute;
    left:0;
    top:0;
    width:50px;
    color: white;
    font-size: 14px;
    font-weight: bold;
    text-align:center;
}

.infinite-classification .list .item .function .icon .image {
    width:22px;
    height:22px;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate3d(-50% , -50% , 0);
    -webkit-transform:translate3d(-50% , -50% , 0);
    -moz-transform:translate3d(-50% , -50% , 0);
    -ms-transform:translate3d(-50% , -50% , 0);
    -o-transform:translate3d(-50% , -50% , 0);
}

.infinite-classification .list .item .function .explain {
    margin-left:50px;
    margin-right:50px;
    color:white;
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
}

.infinite-classification .list .item .function .explain .in {
    position:relative;
}

.infinite-classification .list .item .function .explain .in .ico {
    position:absolute;
    left:0;
    top:0;
    width:20px;
    height:40px;
}

.infinite-classification .list .item .function .explain .in .ico .image {
    width:12px;
    height:12px;
    position:absolute;
    left:0;
    top:50%;
    transform:translate3d(0 , -50% , 0);
    -webkit-transform:translate3d(0 , -50% , 0);
    -moz-transform:translate3d(0 , -50% , 0);
    -ms-transform:translate3d(0 , -50% , 0);
    -o-transform:translate3d(0 , -50% , 0);
}

.infinite-classification .list .item .function .explain .in .text {
    margin-left:20px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}


/*** 标志 ***/
.infinite-classification .list .item .function .flag {
    width:50px;
    position:absolute;
    right:0;
    top:0;
    text-align:center;
    transition:all 0.12s linear;
    -webkit-transition:all 0.12s linear;
    -moz-transition:all 0.12s linear;
    -ms-transition:all 0.12s linear;
    -o-transition:all 0.12s linear;
}

.infinite-classification .list .item .function .flag .switch {
    transition:all 0.12s linear;
    -webkit-transition:all 0.12s linear;
    -moz-transition:all 0.12s linear;
    -ms-transition:all 0.12s linear;
    -o-transition:all 0.12s linear;
}

/**
 * 功能点
 */
.infinite-classification .list .item .function .flag .new , .infinite-classification .list .item .function .flag .number {
    height: 20px;
    line-height: 20px;
    padding: 0 8px;
    position:absolute;
    top:50%;
    right:8px;
    font-size:12px;
    color:white;
    white-space:nowrap;
    border-radius:2px;
    transform:translate3d(0 , -50% , 0);
    -webkit-transform:translate3d(0 , -50% , 0);
    -moz-transform:translate3d(0 , -50% , 0);
    -ms-transform:translate3d(0 , -50% , 0);
    -o-transform:translate3d(0 , -50% , 0);
}

.infinite-classification .list .item .function .flag .new {
    background-color:#d9534f;
}

.infinite-classification .list .item .function .flag .number {
    background-color:#337ab7;
}

.infinite-classification .list .item .function .flag .switch {
    position:absolute;
    left:50%;
    top:50%;
    transform:translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
    -webkit-transform:translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
    -moz-transform:translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
    -ms-transform:translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
    -o-transform:translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
}

.infinite-classification .list .item .function .flag .switch .image {
    width:14px;
    height:14px;
}

.infinite-classification .list .item .child {
    overflow: hidden;
    height: 0;
    background-color: #444d52;
}

/**
 * 左边 icon 样式
 */
.infinite-classification .list .item .function .icon-text {
    color:white;
    font-size:14px;
    font-weight:bold;
}

/**
 * 设置右边 flag 样式
 */
.infinite-classification .list .item .spread .flag .switch {
    transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 180deg);
    -webkit-transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 180deg);
    -moz-transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 180deg);
    -ms-transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 180deg);
    -o-transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 180deg);
}

.infinite-classification .list .item .shrink .flag .swtich {
    transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
    -webkit-transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
    -moz-transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
    -ms-transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
    -o-transform: translate3d(-50% , -50% , 0) rotate3d(0 , 0 , 1 , 0deg);
}

/**
 * 层级颜色，请在这个位置设置扩展层次颜色
 */
.infinite-classification {
    background-color:#373d41;
}

.infinite-classification .function:hover {
    background-color:#282d30;
}

.infinite-classification .list .item .cur {
    background-color:#282d30 !important;
}
